
const str = '<h1>FU</h1>';
const App = ()=>{
  return (
    <div className='app'>   {/*外部引入*/}

      <div>
        {/* <User userName='Fu' age='22' work='小富婆' /> */}
        <User userName='Fu' age={22} work='小富婆' />
        <User userName='Fu' age={22} work='大富婆' />
      </div>

      <div style = { {width:300, height:'300px', background:'grey'}}>
        <div dangerouslySetInnerHTML={{__html:str}}></div>
        <div>{str}</div>
        <div>
          <img style = {{width:300, heigth:300}} src={image} />
          <img style = {{width:300, heigth:300}} src={img} />
          {/* require可以放在行内 */}
          <img style = {{width:300, heigth:300}} 
                src={require('./image/4.jpg').default} />
        </div>
          <div>
            <label htmlFor="username">用户名</label>
            <input id="username" type="text"/>
          </div>
      </div>
    </div>
  );
}